<template>
  <div class='lab fill'>
    <!-- <layout-nav />
    <div class="container">
      <div></div>
    </div>
    <router-view ></router-view> -->
    <a-layout>
      <a-layout-header class="nav-sider">Header</a-layout-header>
      <a-layout>
        <a-layout-sider class="left-sider">Sider</a-layout-sider>
        <a-layout-content>
          <div class="fill app-content">
            <router-view></router-view>
          </div>
        </a-layout-content>
      </a-layout>
    </a-layout>
  </div>
</template>
<script>
  export default {
    data(){
      return {

      }
    },
    props:{},
    components:{
      LayoutNav:()=>import('./Lab/Layout/PublicNav')
    },
    computed:{},
    mounted(){

    },
    methods:{

    }
  }
</script>
<style lang='less' scoped>
  @height:calc(100vh - 64px);
  .nav-sider{
    background: #001529;
    overflow-y: auto;
    overflow-x: hidden;
  }
  .left-sider{
    height: @height;
    background: #0a2845;
    // width: 160px !important;
  }
  .app-content{
    padding: 30px;
    height: @height;
    overflow: auto;
    padding-right: 0;
  }
  // .footer{
  //   text-align: center;
  // }
</style>